<template>
  <div class="ind-assess-manage-index">
    <div class="header">
      <el-button class="back-btn" type="text" icon="el-icon-arrow-left" @click="goBack">返回</el-button>
      <div class="title">{{ schemeInfo && schemeInfo.title }}</div>
      <div class="right">
        <!-- <vip-day class="vip-center" :days="vipDays"></vip-day> -->
        <user-info-icon></user-info-icon>
      </div>
    </div>
    <div class="content" v-if="schemeInfo">
      <assess-index></assess-index>
    </div>
  </div>
</template>

<script>
import AssessIndex from './AssessIndex.vue'
import { IND_TYPE, IND_STEP_STATUS } from '@utility/dict'
import { selectAssessDataDetail } from '@apis/assessManage.js'
import { mapGetters } from 'vuex'
import UserInfoIcon from '@bcom/UserInfoIconNew'
// import VipDay from '@bcom/VipDay.vue'

export default {
  name: 'indAssessManageIndex',
  components: {
    AssessIndex,
    UserInfoIcon,
    // VipDay,
  },
  provide() {
    return {
      operateRoles: this.operateRoles,
    }
  },
  data() {
    return {
      IND_LZNL_TYPE: IND_TYPE.lznl,
      schemeInfo: null,
      operateRoles: {
        scoreCheck: false,
        sharePush: false,
      },
      IND_STEP_UNPUB: IND_STEP_STATUS.unPub,
      schemeId: '',
      schemeList: '',
      schemeTempList: [],
    }
  },
  computed: {
    ...mapGetters(['vipDays']),
    id() {
      return this.$route.params.id
    },
  },
  watch: {
    id() {
      this.getAssessCfg()
    },
  },
  created() {
    if (this.id) {
      this.getAssessCfg()
    }
    this.operateRoles.scoreCheck = this.isScoreCheckRole
    this.operateRoles.sharePush = this.isSharePushRole
  },
  methods: {
    // 获取考核详情
    getAssessCfg() {
      selectAssessDataDetail(this.id).then(res => {
        if (res.status === 200) {
          const resData = res.data
          this.schemeInfo = resData
          this.$store.commit('indReview/setShemeInfo', this.schemeInfo)
        }
      })
    },
    goBack() {
      this.$router.go(-1)
    },
  },
}
</script>

<style lang="scss" scoped>
.ind-assess-manage-index {
  background: #fff;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  .progress-header {
    display: flex;
    align-items: center;
    padding: 15px 20px 5px;
    .title {
      margin-right: 20px;
      margin-top: -3px;
      font-size: 20px;
      font-weight: bold;
      color: #333;
    }
    .scheme-title {
      margin-left: 40px;
      margin-right: 20px;
      margin-top: -3px;
      font-size: 16px;
      color: #333;
    }
    .scheme-selection {
      width: 300px;
      .el-icon-search {
        line-height: 38px;
        margin-left: 4px;
        font-size: 16px;
      }
    }
  }
  .header {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    box-shadow: 0px 2px 14px 1px rgba(67, 71, 74, 0.15);
    background-color: #fff;
    .title {
      margin-left: 20px;
      margin-top: -3px;
      font-size: 20px;
      font-weight: bold;
      color: #333;
    }
    .back-btn {
      font-size: 20px;
      padding: 0px;
    }
    .right {
      flex: 1;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      .vip-center {
        margin-right: 20px;
      }
      /deep/.user-info-poppor {
        color: #333;
      }
    }
  }
  .content {
    flex: 1;
    overflow: hidden;
  }
}
</style>
